<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>这是第一个网页</title>
</head>

<body>
    <!--所有网页中的内容都要写在body中  -->
    dfasdfasdfasdf <br>
    asdfasdfasdf <br>
    asdfasdfasdfasdfasdf <br>

    <!-- 标题标签 -->
    <h1>这是一个标题标签</h1>
    <h2>这是一个标题标签</h2>
    <h3>这是一个标题标签</h3>
    <h4>这是一个标题标签</h4>
    <h5>这是一个标题标签</h5>
    <h6>这是一个标题标签</h6>

    <!-- 段落标签  p*n tab -->
    <!-- 调整格式   alt+shift+f -->
    <p>这是一个段落标签</p>
    <p>这是一个段落标签</p>
    <p>这是一个段落标签</p>
    <p>这是一个段落标签</p>

    <!-- 超链接（跳转页面） -->
    <a href="http://www.baidu.com">这是一个超链接</a>
    <!-- 在新窗口中打开success.html -->
    <a href="success.html" target="_blank">网易</a>
    <!-- 引用图像 -->
    <a href="success.html"><img src="img/technology.png" alt=""></a>

    <img src="img/home-bg.png" alt="">
    <!-- 表格(table)  tr行   td列 -->
    <!-- table>tr*3>td*3          -->
    <table border="1">
        <tr>
            <td>编号</td>
            <td>姓名</td>
            <td>性别</td>
            <td>所在学校</td>
        </tr>
        <tr>
            <td>100</td>
            <td>tom</td>
            <td>女</td>
            <td>neusoft</td>
        </tr>
        <tr>
            <td>101</td>
            <td>jazz</td>
            <td>男</td>
            <td>neusoft</td>
        </tr>
    </table>

    <!--无序列表  -->
    <ul>
        <li><a href="success.html">Java</a></li>
        <li>
            Python
            <!-- ul>li*2 -->
            <ul>
                <li>python_1</li>
                <li>python_2</li>
            </ul>
        </li>
        <li>Ruby</li>
        <li>AngularJs</li>
    </ul>

    <!-- 有序列表 -->
    <ol>
        <li>Java</li>
        <li>Python</li>
        <li>Ruby</li>
        <li>AngularJs</li>
    </ol>
    <!-- 自定义列表 -->
    <dl>
        <dt>Coffee</dt>
        <dd>Black hot drink</dd>
        <dt>Milk</dt>
        <dd>White cold drink</dd>
    </dl>
    <!-- 块 div  需要与css结合使用才会有效果，否则是没有任何效果的  特点：自动换行 -->
    <div>这是一个块级元素</div>
    <div>这是一个块级元素</div>
    <div>这是一个块级元素</div>

    <!-- 表单：用于收集用户数据的 -->
    <!-- method=GET/POST 表单一般都设置为post，可以隐藏表单中的数据-->
    <form action="" method="POST">
        <!-- 文本输入框 -->
        <!-- required 必填项  -->
        <!-- 文本框的提示信息 placeholder  -->
        username: <input type="text" required placeholder="请输入用户名"> <br>
        <!-- 密码输入框 -->
        password: <input type="password"> <br>
        <!-- 单选按钮 -->
        sex: <input type="radio" name="s" checked="checked"> M
        <input type="radio" name="s"> F <br>
        <!-- 复选框 -->
        hib: <input type="checkbox" name="c">体育
        <input type="checkbox" name="c" checked="checked">音乐
        <input type="checkbox" name="c">读书 <br>
        <!-- 下拉列表 -->
        language:
        <select>
            <!-- 列表项 -->
            <option>Java</option>
            <option>NodeJs</option>
            <option>AngularJs</option>
            <option>C++</option>
        </select> <br>
        <!-- 定义一个普通的按钮 -->
        <!-- 注意：普通按钮不会将表单的数据提交给服务器的 -->
        <input type="button" value="这就是一个普通的按钮"><br>
        <!-- 文件上传/文件域 -->
        <input type="file"><br>
        <!-- 隐藏域，不会在当前页面中显示出来，作用是从客户端向服务器端传递数据的 -->
        <input type="hidden" name="q" value="123"><br>
        <!-- html5中新增加的类型 -->
        date: <input type="date"> <br>
        email: <input type="email"><br>
        <!-- 提交以及重置按钮 -->
        <input type="submit" value="注册"> <input type="reset" value="取消">

        <!-- <textarea name="message" rows="10" cols="30">
            The cat was playing in the garden.
        </textarea> -->
    </form>


</body>

</html>